<template>
  <div>
    <h1>{{showNum}}</h1>
    <h1>{{age}}</h1>
    <button @click='addAsyn(50)'>change</button>
  </div>

</template>

<script>
import {mapState} from "vuex";
import {mapMutations} from "vuex";
import {mapActions} from "vuex";
import {mapGetters} from "vuex";

export default {
  name: "component1",
  computed:{
    ...mapState(['name','age']),
    ...mapGetters(['showNum']),
  },
  methods:{
    ...mapMutations(['change','changeAge']),
    ...mapActions(['addAsyn']),
    change(){
      this.$store.dispatch('addAsyn',"100")
    }
  },
}
</script>

<style scoped>

</style>
